// eslint-disable-next-line import/no-extraneous-dependencies
import ReactRenderer from '@alilc/lowcode-react-renderer'
import { Spin } from 'antd'
import React from 'react'

import useLowCodeSchema from './useLowCodeSchema'

const utils = {
  hello: () => {
    console.log('hello')
  },
}

const constants = {
  PAGENAME: '列表',
}

const TestLowCode: React.FC = () => {
  const { loading, components, schema } = useLowCodeSchema()

  return (
    <Spin spinning={loading}>
      <pre>{JSON.stringify(components, null, ' ')}</pre>
      {/* <pre>{JSON.stringify(schema, null, ' ')}</pre> */}
        <ReactRenderer
          schema={schema}
          components={components}
          onCompGetCtx={(schema, ctx) => {
            console.log(schema, ctx)
          }}
          appHelper={{
            utils,
            constants,
            // location,
            // history: {
            //   action: history.action,
            //   location: history.location,
            //   createHref: history.createHref,
            //   push: history.push,
            //   replace: history.replace,
            //   go: history.go,
            //   back: history.goBack,
            //   forward: history.goForward,
            //   listen: history.listen,
            //   block: history.block,
            // },
          }}
          onCompGetRef={(schema, ref) => {
            console.log(schema, ref)
          }}
          locale='zh-CN'
        />
    </Spin>
  )
}

export default TestLowCode
